<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script type="text/javascript">
    let person = {
      name: '张三',
      age: 18
    }
    let p = {}
    Object.keys(person).forEach(el => {
      Object.defineProperty(p, el, {
        configurable: true,
        set(value) {
          console.log('change:', el)
          return person[el] = value
        },
        get () {
          return person[el]
        }
      })
    })

    let w = new Proxy(person, {
      get(a, b) {
        console.log('get:', b)
        return a[b]
      },
      set(a, b, value) {
        console.log('change:', b)
        return a[b] = value
      },
      deleteProperty(a, b) {
        console.log('delete:', b)
        return delete a[b]
      }
    })
    // 通过反射对象
    let obj = { a: 1, b: 1 }
    Reflect.get(obj, a)
    Reflect.set(obj, a, 3)
    Reflect.deleteProperty(obj, b)
    const tryBool = Reflect.defineProperty(obj, 'c', {
      get() {
        return 3
      }
    })
    console.log(tryBool)
  </script>
</body>
</html>